<template>
  <div :class="prefixCls" class="relative w-full h-full px-4" >
    <div class="flex items-center right-4 top-4 absolute">
      <!-- 主题切换 -->
      <!-- 语言切换 -->
      <AppLocalePicker :show-text="false" v-if="!sessionTimeout && showLocale" />
    </div>
    {{t('common.okText')}}
  </div>
</template>

<script lang="ts" setup>
  import { AppLocalePicker } from '@/components/Application'
  import { useDesign } from '@/hooks/web/useDesign'
  import { useLocaleStore } from '@/store/modules/locale'
  import { useI18n } from '@/hooks/web/useI18n'

  defineProps({
    sessionTimeout: {
      type: Boolean
    }
  })

  const { prefixCls } = useDesign('login')
  const { t } = useI18n()
  const localeStore = useLocaleStore()
  const showLocale = localeStore.getShowPicker
</script>

<style lang="less">
  // @prefix-cls: ~'@{namespace}-login';
  @dark-bg: #293146;
  html[data-theme='dark'] {
    background-color: @dark-bg
  }

</style>